<template>
  <el-button size="small" type="primary" :plain="!curState" @click="voteDislike" :loading="loading">
    <svg-icon v-show="!loading" icon-name="dislike-fill"/>
    {{ doc.voteCounts.dislike }}
  </el-button>
</template>

<script>
import { formatResource } from '@/components/spaces/resources-v2/format';

export default {
  name: 'vote-dislike',
  props: {
    doc: Object,
  },
  data() {
    return {
      loading: false,
    };
  },
  computed: {
    curState() { return this.doc.voteStates.dislike; },
  },
  methods: {
    voteDislike() {
      this.loading = true;
      this.$api.other.vote({
        votePosition: 'ProductFile', // 对问题点赞
        votePositionId: this.doc.id,
        voteAction: 'dislike',
        voteState: !this.curState,
      }).then((res) => {
        this.$root.$emit('checkScore', this.$va.initScoreType('dislike', !this.curState)); // 更新数据前请求积分
        this.$emit('voted', formatResource(res.data));
      }).catch(() => {})
        .then(() => { this.loading = false; });
    },
  },
};
</script>

<style></style>
